import {httpIDC} from "../../../../js/rangeidc/http/httpIDC.js";
import {url_userName} from "../../../../js/rangeidc/http/httpConfig.js";
import {url_allRole1} from "../../../../js/rangeidc/http/httpConfig.js";
import Pinyin from "../../../../js/chinesePY-master/ChinesePY.js";


export const  acountManagerTopSearch = {

    template:`
    
    <div>        
     <div class="searchInputSuper">
      <div class="inputBackgroundClass" style="float: left;">   
           <el-autocomplete
             style="background: transparent"
             class="inline-input"
             v-model="searchName"
             clearable
             :fetch-suggestions="querySearch"
             :placeholder="placeholderName"
             @select="handleSelect"
           > 
           </el-autocomplete>
        
        </div> 
      <div style="float:left;cursor: pointer;" type="button" id="searchButton" class="searchButton" @click="searchDetailInfo">查询</div>  
      <div  class="right" id="right" @click="addAccount">
       <label style="cursor: pointer;" class="rightLabel">{{addTitle}}</label>
      </div>
     </div>  
    </div>
    
    
    `,

    data:function () {
        return{

            //搜索框 v-model
            selectedName:"",
            //站位名字
            placeholderName:"请输入查询条件",
            addButtonShow:false,
            showScrollList:false,
            //显示列表数据
            searchTableListDatas:[],
            //copy数据数据做中间变量
            searchTableListDatasCopy:[],
            //copy一份数据，在条件为nil的时候，显示全部数据
            searchTableListDatasOrigin:[],
            searchName:"",
        }
    }
    ,
    props:{
        changeInputValue:String,
        permissionArray:"",
        addTitle:"",
    }
    ,
    methods: {

        handleSelect:function(items){

            console.log(items);
        },

        //搜索框输入条件
        querySearch:function(queryString,callback){

            this.searchTableListDatas = this.searchTableListDatasCopy.filter(item =>{
                if (item.jpString.indexOf(queryString.toUpperCase())!==-1||item.label.indexOf(queryString)!==-1 || item.qpString.indexOf(queryString)!==-1||item.jpString.indexOf(queryString)!==-1){
                    return true;
                }
            })
            callback( this.searchTableListDatas)

        },

        inputClick:function(){

            if (this.searchName==null){
                this.searchTableListDatas = this.searchTableListDatasOrigin;
            }
        },

        //模糊查询
        accountCondicationFunciton:function(condition){

            this.searchTableListDatas = this.searchTableListDatasCopy.filter(item =>{
                if (item.jpString.indexOf(condition.toUpperCase())!==-1||item.label.indexOf(condition)!==-1 || item.qpString.indexOf(condition)!==-1||item.jpString.indexOf(condition)!==-1){
                    return true;
                }
            })

        },

        //添加账号点击事件
        addAccount: function (){

           this.$emit("isShowCover",true);
        },

        //点击搜索按钮
        searchDetailInfo:function () {
            console.log(this.searchName);
            this.$emit("searchButton",this.searchName);
        },


        //获取搜索框列表数据
        requestSearchAccountListData:function () {

            let dict = {
                "req":""
            }

            let weakSelf = this;
            httpIDC.post(url_userName,dict,function (result) {
                var tempArrays=[];
                if (result.length){
                    for (let i = 0 ; i < result.length;i ++ ){
                        var tempObjc={};
                        tempObjc.label = result[i];
                        tempObjc.value = result[i];
                        tempObjc.id = i;
                        tempObjc.qpString = Pinyin.GetQP(result[i]);
                        tempObjc.jpString = Pinyin.GetJP(result[i]);
                        tempArrays.push(tempObjc)

                    }
                }

                weakSelf.searchTableListDatas = tempArrays;
                weakSelf.searchTableListDatasCopy = tempArrays;
                weakSelf.searchTableListDatasOrigin = tempArrays;
                console.log(tempArrays)

            },function (fail) {
                console.log(fail)
            });

        },

        //添加角色搜索列表
        requestSearchRoleListData:function () {

            let dict = {
                "req":""
            }
            let weakSelf = this;
            httpIDC.post(url_allRole1,dict,function (result) {


                var tempArrays=[];
                if (result.length){
                    for (let i = 0 ; i < result.length;i ++ ){
                        var tempObjc={};
                        tempObjc.label = result[i];
                        tempObjc.value = result[i];
                        tempObjc.id = i;
                        tempObjc.qpString = Pinyin.GetQP(result[i]);
                        tempObjc.jpString = Pinyin.GetJP(result[i]);
                        tempArrays.push(tempObjc)
                    }
                }

                weakSelf.searchTableListDatas = tempArrays;
                weakSelf.searchTableListDatasCopy = tempArrays;
                weakSelf.searchTableListDatasOrigin = tempArrays;


            },function (fail) {
                console.log(fail)
            });

        }
        ,
    },

    mounted(){

        if (this.permissionArray[0] !=0){
            //根据权限是否显示右上角的添加按钮
            this.addButtonShow = true;
        }

        if (this.addTitle == "添加账号"){
            this.requestSearchAccountListData();
            this.placeholderName = "请输入姓名";
        }

        if (this.addTitle == "添加角色"){
            this.requestSearchRoleListData();
            this.placeholderName = "请输入查询条件";
        }

    }


}